<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    let name = "cz";
    let age = 15;
    /* let json = { 传统的对象写法
      name: name,
      age: age,
      showage: function () {},
      showname: function () {}
    }; */
    let json = {
      name,
      age,
      showname() { //不要用箭头函数
        return this.name;
      },
      showage() {
        return this.age;
      }
    };
    console.log(json.showage(), json.showname());
  </script>
  <script>
    /* 
      Object.is()
        判断两个数是否相等
    */
    console.log(Object.is(+0, -0));
    console.log(Object.is(NaN, NaN));
  </script>
  <script>
    /* 
      Object.assign(目标对象,source1,source2...);
        用来合并对象的(若有相同的内容,会发生覆盖)
    */
    let json1 = {
      a: 1
    };
    let json2 = {
      b: 2,
      a: 4 //会覆盖前面的值
    };
    let json3 = {
      c: 3
    };
    let objjson = Object.assign({}, json1, json2, json3);
    console.log(objjson);
  </script>
  <script>
    /* 
      Object.keys()
      Object.values()
      Object.entries()
        这三个方法是用来遍历对象
    */
    {
      let {
        keys,
        values,
        entries
      } = Object; //使用了结构解结的方法赋值了

      let jsons = {
        name: "cz",
        age: 18,
        say: "爱人"
      };
      for (let key of keys(jsons)) {
        console.log(key);
      };
      for (let value of values(jsons)) {
        console.log(value);
      };
      for (let [index, value] of entries(jsons)) {
        console.log(`${index} === ${value}`);
      };
    };
  </script>
  <script>
    /* 
      ... 对象扩展结构
    */
    let {
      x,
      y,
      ...z
    } = {
      x: 1,
      y: 2,
      a: 3,
      b: 4,
      c: 5
    };
    console.log(x, y, z);
  </script>
  <script>
    // 多级对象的解构
    "use strict"; {
      let obj = {
        name: "yc",
        user: {
          id: 123,
          password: 456
        }
      };
      // 当内层对象丢失时，避免报错(可以保留源user)
      let { name, user, user: { id, password } = {} } = obj;
      console.log(name);
      console.log(user);
      console.log(id);
      console.log(password);
    };
  </script>
  <script>
    // 解构时指定别名，只有当数据为undefined可以重新赋值，
    "use strict"; {
      let obj = { a: "111", b: "222" };
      let { a: n, b: m = "不信" } = obj;
      console.log(n, m);
    }
  </script>
  <script>
    // 解构重命名，并赋值默认值
    let obj = {
      info: {
        height: 100
      }
    }

    let { info: { height: h = "给个默认值" } = {} } = obj
    console.log("解构重命名", h)
  </script>
</body>

</html>